<template>
  <gg-form-item :tip="tip" :must="must" :label="label" :message="message" :messageDisplay="messageDisplay" :labelWidth="localLabelWidth"
    :layout="localLayout">
    <view class="gg-radio-sex">
      <radio-group @change="radioChange">
        <label class="gg-radio-sex-item" v-for="(item) in items" :key="item.value">
          <view class="">
            <radio :value="item.value" :checked="item.value === itemsValue" style="transform:scale(0.7)" />
          </view>
          <view>{{item.text}}</view>
        </label>
      </radio-group>
    </view>
  </gg-form-item>
</template>

<script>
import MixinsRadio from '../mixins/mixins-radio.js';
export default {
  mixins: [MixinsRadio],
  name: "GgRadio",
  inject: {
    ggFormGroup: {
      default() {
        return null
      }
    }
  },
  props: {
    dataLists: {
      type: [Array, String],
      default: []
    },
  },
  data() {
    return {
      localVal: '',
      items: [],
      itemsValue: '',
    };
  },
  watch: {
    dataLists(newVal) {
      if (this.dataUrl == '') {
        this.dataLists = newVal;
        this.items = this.itemsSortOut();
        this._dealValue();
      }
    }
  },
  created: function () {
    this.localVal = this.value;
    this.items = this.itemsSortOut();
    //默认Value
    this._dealValue();
  },
  methods: {
    itemsSortOut: function () {
      let original = [];
      if (this.dataUrl) {
        //网络请求
        if (typeof this.dataUrl == 'function') {
          this.dataUrl({}).then((successRes) => {
            original = successRes.data;
          });
        } else {
          console.warn('此处需要自定义请求方法');
        }
      } else {
        original = this.dataLists;
      }
      if (typeof original == 'string') {
        original = JSON.parse(original);
      }
      //整理数据
      let items = [];
      let dataValue = this.dataValue ? this.dataValue : 'value';
      let dataText = this.dataText ? this.dataText : 'text';
      let i = 0;
      for (i in original) {
        let data = original[i];
        items.push({
          value: data[dataValue].toString(),
          text: data[dataText]
        })
      }
      return items;
    }
  }
};
</script>

<style>
.gg-radio-sex {
  min-height: 35px;
}
.gg-radio-sex-item {
  height: 35px;
  line-height: 35px;
  float: left;
  display: flex;
  margin-right: 10px;
}
</style>
